<!DOCTYPE html>
<html>
	<head>
		<!--
        	作者：山东交通学院-计升191-朱厚宇
        	时间：2020-03-18
        	描述：蛋糕店CSS3+HMTL5
        -->
		<meta charset="utf-8" />
		<!--网站图标-->
		<link rel="icon" href="img/favicon.ico" >
		<title>猫咪蛋糕店</title>
		<!--轮播图CSS-->
		<link rel="stylesheet" href="css/reset.css">
		<link rel="stylesheet" href="css/style.css">
		<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
		<script src="js/easySlider.js"></script>
		<!--界面CSS-->
		<link rel="stylesheet" type="text/css" href="css/main.css"/>
		<!--轮播图插件-->
		<script type="text/javascript">
			$(function() {
				$("#slider").easySlider( {
					slideSpeed: 500,
					paginationSpacing: "15px",
					paginationDiameter: "12px",
					paginationPositionFromBottom: "20px",
					slidesClass: ".slides",
					controlsClass: ".controls",
					paginationClass: ".pagination"					
				});
			});
		</script>
	</head>
	<body>
		<!--头部导航栏-->
		<nav>
			<div class="headr-nav">
				<a class="header-logo" href="https://www.blogzhy.top"><img src="img/header_logo.png"/></a>
				<ul class="nav-box">
					<li><a href="index.html">首页</a></li>
					<li><a href="newProduct.html">新品</a></li>
					<li><a href="birthday.html">生日</a></li>
					<li><a href="children.html">儿童</a></li>
					<li><a href="party.html">聚会</a></li>
					<li><a href="newUser.html">活动专区</a></li>
					<li id="shoppingcat"><a href="shop.html"><img src="img/shoppingCart.png"  height="40px" />购物车</a></li>
				</ul>
			</div>
		</nav>
		
		<!--轮播图-->
		<div id="slider">
			<ul class="slides clearfix" style="">
				<li><img class="responsive" src="img/banner_1.jpg"></li>
				<li><img class="responsive" src="img/banner_2.jpg" style="vertical-align: middle;"></li>
			</ul>
			<ul class="controls">
				<li><img src="img/prev.png" alt="previous"></li>
				<li><img src="img/next.png" alt="next"></li>
			</ul>
			<ul class="pagination">
				<li class="active"></li>
				<li></li>
			</ul>
		</div>
		<!--分类-->
		<div class="home_menu">
			<!--锚链接#加id-->
			<a href="#main1"><img src="img/home1.jpg" alt="新品" title="新品"/></a>
			<a href="#main2"><img src="img/home2.jpg" alt="生日" title="生日" /></a>
			<a href="#main3"><img src="img/home3.jpg" alt="儿童" title="儿童"/></a>
			<a href="#main4"><img src="img/home4.jpg" alt="聚餐" title="聚餐"/></a>
			<a href="#main5"><img src="img/home5.jpg" alt="活动专区" title="活动专区"/></a>
		</div>
		<!--新品专区-->
		<div class="separate" id="main1"></div><!--锚链接跳转后导航栏会"遮住"分类标题,所以id不能设置在main上-->
		<div class="main">
			<a href="newProduct.html"><h4>新品<span>/专区</span></h4></a>
			<a href="newProduct.html"><img class="topbanner" src="img/topbanner1.jpg"></a>
			<div class="box_list">
				<ul>
					<li>
						<a href=""><img src="img/newProduct/new1.png" /></a>
						<h6>米道</h6>
						<p>天真、天然，是这款蛋糕唯一的出发点</p>
						<div class="price">
							<span>￥268.00/454G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/newProduct/new2.png" /></a>
						<h6>(新)卡百利</h6>
						<p>八个风味层次，让草莓果香次第送出</p>
						<div class="price">
							<span>￥298.00/454G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/newProduct/new3.png" /></a>
						<h6>草莓奶油</h6>
						<p>草莓配奶油,前往温布尔登的雨季</p>
						<div class="price">
							<span>￥228.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/newProduct/new4.png" /></a>
						<h6>(新)栗蓉暗香</h6>
						<p>新栗上市，栗香正浓</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<!--生日专区-->
		<div class="separate" id="main2"></div><!--锚链接跳转后导航栏会"遮住"分类标题,所以id不能设置在main上-->
		<div class="main">
			<a href="birthday.html"><h4>生日<span>/专区</span></h4></a>
			<a href="birthday.html"><img class="topbanner" src="img/topbanner2.jpg"></a>
			<div class="box_list">
				<ul>
					<li>
						<a href=""><img src="img/birthday/birthday1.png" /></a>
						<h6>深爱</h6>
						<p>你深爱过一个人么</p>
						<div class="price">
							<span>￥268.00/454G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/birthday/birthday2.png" /></a>
						<h6>榴莲飘香</h6>
						<p>丰厚乳汁奶油，打入足量榴莲果肉</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/birthday/birthday3.png" /></a>
						<h6>黑白巧克力慕斯 彼尔德(HBD)</h6>
						<p>卡通定制撒粉，简单、柔软</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/birthday/birthday4.png" /></a>
						<h6>枣儿</h6>
						<p>红枣奶油味，与姜撞奶茶慕斯</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<!--儿童专区-->
		<div class="separate" id="main3"></div><!--锚链接跳转后导航栏会"遮住"分类标题,所以id不能设置在main上-->
		<div class="main">
			<a href="children.html"><h4>儿童<span>/专区</span></h4></a>
			<a href="children.html"><img class="topbanner" src="img/topbanner3.jpg"></a>
			<div class="box_list">
				<ul>
					<li>
						<a href=""><img src="img/children/children1.png" /></a>
						<h6>黑白巧克力慕斯 彼尔德(Party)</h6>
						<p>"孩子的世界，简单到非黑即白"</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/children/children2.png" /></a>
						<h6>米道</h6>
						<p>一款专为孩子设计的蛋糕</p>
						<div class="price">
							<span>￥298.00/454G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/children/children3.png" /></a>
						<h6>芒果奶油蛋糕</h6>
						<p>21cake配方芒果百香果慕斯夹心</p>
						<div class="price">
							<span>￥198.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/children/children4.png" /></a>
						<h6>百香果乳酸酪慕斯</h6>
						<p>冰淇淋口感，不同层次的酸与冰凉</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<!--聚会专区-->
		<div class="separate" id="main4"></div><!--锚链接跳转后导航栏会"遮住"分类标题,所以id不能设置在main上-->
		<div class="main">
			<a href="party.html"><h4>聚会<span>/专区</span></h4></a>
			<a href="party.html"><img class="topbanner" src="img/topbanner4.jpg"></a>
			<div class="box_list">
				<ul>
					<li>
						<a href=""><img src="img/party/party1.png" /></a>
						<h6>6口味切块</h6>
						<p>多口味，精装小份</p>
						<div class="price">
							<span>￥198.00/440G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/party/party2.png" /></a>
						<h6>黑白巧克力慕斯</h6>
						<p>白巧克慕斯的甜，黑巧克力酱的苦</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/party/party3.png" /></a>
						<h6>朗姆芝士</h6>
						<p>清香柠檬与奶酪夹心，微苦、微醺</p>
						<div class="price">
							<span>￥228.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
					<li>
						<a href=""><img src="img/party/party4.png" /></a>
						<h6>冻慕斯与焗芝士</h6>
						<p>马斯卡彭慕斯，叠加法国软芝士</p>
						<div class="price">
							<span>￥298.00/908G</span><a href="" class="addcar">加入购物车</a>
						</div>
					</li>
				</ul>
			</div>
		</div>
		<!--活动专区-->
		<div class="separate" id="main5"></div><!--锚链接跳转后导航栏会"遮住"分类标题,所以id不能设置在main上-->
		<div class="main">
			<a href=""><h4>活动<span>/抓紧行动</span></h4></a>
			<a href=""><img class="topbanner" src="img/newUser/newuser.jpg" style="width: 50%;"></a>
		</div>
		
		<!--底部-->
		<footer>
			<a href="">联系我们</a>
			<span>|</span>
			<a href="">订购帮助</a>
			<span>|</span>
			<a href="">企业合作</a>
			<span>|</span>
			<a href="">生产经资质</a>
			<span>|</span>
			<a href="">公告专区</a>
		</footer>







		
		
	</body>
</html>
